<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/header.css">
		<link rel="stylesheet" href="../fonticons/iconfont.css">
		<style type="text/css">
			.mui-content {
				margin-top: 40px;
				font-size: 2em;
			}

			span {
				font-weight: 900;
			}
		</style>
	</head>
	<body>

		<!-- 底部选项卡 -->
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active" tabindex="0">
				<span class="mui-icon mui-icon-chat"></span>
				<span class="mui-tab-label" id="wh-title">微涵</span>
			</a>
			<a class="mui-tab-item" tabindex="1">
				<span class="mui-icon iconfont icon-tongxunlu" id="ContactsCount">

				</span>
				<span class="mui-tab-label">通讯录</span>

			</a>
			<a class="mui-tab-item" tabindex="2">
				<span class="mui-icon iconfont icon-ziyuanmdpi"></span>
				<span class="mui-tab-label">发现</span>
			</a>
			<a class="mui-tab-item" tabindex="3">
				<span class="mui-icon iconfont icon-wo"></span>
				<span class="mui-tab-label">我</span>
			</a>
		</nav>

	</body>


	<script src="../js/mui.min.js"></script>
	<script src="../js/app.js"></script>
	<script type="text/javascript" charset="utf-8">
		mui.init();
		//定义用于存储选项卡数组
		var subPages = [{
			pageId: "wh-chatlist.html",
			pageUrl: "wh-chatlist.html"
		}, {
			pageId: "wh-contact.html",
			pageUrl: "wh-contact.html"
		}, {
			pageId: "wh-discover.html",
			pageUrl: "wh-discover.html"
		}, {
			pageId: "wh-me.html",
			pageUrl: "wh-me.html"
		}];

		var pageStyle = {
			top: '0px',
			bottom: '55px',
		}
		mui.plusReady(function() {
			//网络事件监听
			netChangeSwitch();

			plus.nativeUI.showWaiting("等待片刻");
			setTimeout(function() {
				plus.nativeUI.closeWaiting();
			}, 1000)

			//设置系统字体颜色
			plus.navigator.setStatusBarStyle("white");
			//设置系统状态栏颜色
			plus.navigator.setStatusBarBackground("#007AFF");
			//选项卡代码
			var indexWebView = plus.webview.currentWebview();
			for (var i = 0; i < subPages.length; i++) {
				var wv = plus.webview.create(subPages[i].pageUrl, subPages[i].pageId, pageStyle);
				//隐藏
				wv.hide();
				//追加子窗口到主窗口
				indexWebView.append(wv);
			}


			//设置默认窗口页面
			plus.webview.show(subPages[0].pageId);
			mui(".mui-bar-tab").on("tap", "a", function() {
				var thisIndex = this.getAttribute("tabindex");
				for (var i = 0; i < subPages.length; i++) {
					plus.webview.hide(subPages[i].pageId, "fade-out", 0);
				}
				plus.webview.show(subPages[thisIndex].pageId, "fade-in", 0);
				var wobj = plus.webview.getWebviewById(subPages[thisIndex].pageId);
				wobj.reload();
			})


			//延时加载
			setTimeout("initData()", 1000);

			//初始化消息条数
			/* mui.ajax(app.serverUrl + '/user/queryRequestMsgCount', {
				data: {
					id: app.getUserGlobalInfo().id
				},
				type: 'post', //HTTP请求类型
				timeout: 10000, //超时时间设置为10秒；
				success: function(data) {
					if (data.status == 200) {
						console.log(JSON.stringify(data));
						var count = data.data;
						if (count > 0) {
							document.getElementById('ContactsCount').innerHTML = '<span class="mui-badge">' + count + '</span>';
						}
					} else { //服务器返回的数据为空,表明账户与密码验证失败
						app.showToast(data.data, "error"); //弹出错误信息
					}
				},
				error: function(XMLHttpRequest, textStatus, errorThrown) {
					if (textStatus == "timeout") {
						mui.toast("连接超时"); //超过十秒报错
					} else if (textStatus == "error") {
						mui.toast("连接出错");
					}
				}
			});
			*/

		})
		//预加载
		function initData() {
			var bird_chatlist = plus.webview.getWebviewById("wh-chatlist.html");
			mui.fire(bird_chatlist, "refresh");
			var bird_me = plus.webview.getWebviewById("wh-me.html");

			mui.fire(bird_me, "refresh");
			var s = app.getContactList();
			console.log(JSON.stringify(s));
		}

		//监听网络状态的函数
		function netChangeSwitch() {
			document.addEventListener("netchange", function() {
				//获取网络状态
				var connectionStatus = plus.networkinfo.getCurrentType();
				if (connectionStatus != 0 && connectionStatus != 1) {
					var bird_title = document.getElementById("wh-title");
					bird_title.innerHTML = "<b>' 微 涵 ' 聊 天</b>";
				} else {
					//网络异常
					var bird_title = document.getElementById("wh-title");
					bird_title.innerHTML = "<b>' 微 涵 ' 聊 天（未连接）</b>";
				}
			});
		}
	</script>
</html>
